Los AngelesFor The Restless
Free Shipping Over $150
Design System — Reverse-Engineered

Design System
Analysis of AETHER Apparel

A stark, gallery-white system with absolute-black ink, no saturated colour, and a single warm sand accent — built for technical apparel, with all the personality carried by an extended grotesque and a utilitarian mono.

01 — Foundations

Colour Palette

Effectively monochrome: black ink, white canvas, one soft grey, and a single warm sand. Contrast does the work a palette usually would.

02 — Foundations

Typography

Three Maison Neue cuts — substituted here with Archivo (expanded), Inter, and IBM Plex Mono. Hierarchy is built from size, not weight; the brand voice lives in the tiny mono.

03 — Components

Button Variants

button-primary
Solid black pill, uppercase, 1.2px tracking. The default action everywhere.
button-inverted
White pill for use over imagery and dark bands.
button-outline
1px solid ink, transparent fill — the quiet secondary.
utility-pill
Sand-filled pill for filters, tags and facets.
04 — Components

Product Cards

Flat by default — a 5px-radius image on white, separated by hairlines. A soft even glow appears only on hover. Prices are set in mono.

05 — Components

Form Elements

Minimal fields on the 5px radius, hairline border darkening to ink on focus. Labels are set in uppercase mono.

text-input · email
textarea · message
06 — Foundations

Spacing Scale

A 4px base on an 8px working rhythm, scaling out to generous 48–64px gaps that let full-width imagery breathe.

07 — Foundations

Border Radius

A barely-rounded 5px workhorse for media and inputs; controls round all the way to a pill.

08 — Foundations

Elevation & Depth

Level 0 — 1px hairline only. The default. Nearly everything sits flat on the canvas.
Level 1 — a soft, even 0 0 8px rgba(0,0,0,.2) glow, the one shadow used in the wild, appearing on hover.
Level 2 — a deeper, diffuse drop reserved for the cart drawer and modal overlays.
09 — Responsive

Responsive Behavior

NameWidthKey changes
Mobile< 768pxProduct grids collapse to 1–2 up; utility strip trims to clock + city; nav becomes a drawer.
Tablet768–1023pxFour-up grids become two-up; hero type steps down to ~42px.
Laptop1024–1279pxFull four-up product grid returns; sticky header condenses on scroll.
Desktop≥ 1280pxMax 1200px editorial canvas, centred, with full-bleed imagery bands.

The page reads as a stack of full-width editorial panels, alternating white with #f5f5f5 and occasional sand bands rather than a boxed, carded layout.

10 — Pattern

AETHER Insider Tiers

Sample membership table demonstrating the pricing pattern — the live site has no pricing page, so this is brand-appropriate placeholder content.

Essentials
$0/year
Create an account and start earning.
  • Order tracking & history
  • Free 30-day returns
  • Early-access waitlist
Insider● Most chosen
$48/year
For the restless who live in the kit.
  • Everything in Essentials
  • Free expedited shipping
  • First access to every drop
  • Members-only colourways
Collective
$120/year
Lifetime gear, looked after.
  • Everything in Insider
  • Free repairs for life
  • Concierge styling
  • Archive & sample sales
11 — Pattern

Order History

Sample account table demonstrating the data pattern: mono IDs, pill status chips, hairline rows.

OrderItemSizeStatusWhen
#AE-48213Alice Linen ShirtMDeliveredJun 24
#AE-48109Dune Tech Short32DeliveredJun 18
#AE-47996Moto Riding JacketLIn transitJun 14
#AE-47880Restless Merino TeeMProcessingJun 11
#AE-47731Capsule Crew SweatSDeliveredJun 03
1–5 of 412
123
12 — Pattern

Account

Sample auth forms demonstrating the input + button patterns end to end.

Sign in

Welcome back

Or
Create account

Join AETHER

Or